/**
 * 首页
 *
 * @Author   guoran
 *
 * @DateTime 2015-12-24T11:27:18+0800
 *
 * @param    {object}                 opts 外部参数
 */
var Index = function(opts) {
    var speed = 2000,
        scrollT = 2.5;

    function Init() {
        LoadData();
        LoadAnimate();
        LoadMouseScroll();
        PageLoad();
        LoadChart();
    }

    function PageLoad() {
        $('.btn-entry').click();
    }

    function LoadData() {
        if (Data) {
            var items = [];
            $(Data.List).each(function(i, item) {
                if (i % 2 == 0) {
                    items.push('<div class="item-box item{0}"><div class="left-box"><div class="content-box">{1}<div class="content-box-description"><h4>{4}</h4>{3}</div></div></div><div class="right-box"><span class="content-box" style="{2}"></span></div></div>'.format(i, item.text, item.style, item.description, item.date));
                } else {
                    items.push('<div class="item-box dbrow item{0}"><div class="right-box"><span class="content-box" style="{2}"></span></div><div class="left-box"><div class="content-box">{1}<div class="content-box-description"><h4>{4}</h4>{3}</div></div></div></div>'.format(i, item.text, item.style, item.description, item.date));
                }
            });
            $('.end').before(items.join(''));
        }
    }

    function LoadMouseScroll() {

        function scroll(delta) {
            var top = $('body').scrollTop(),
                curr = $('.current'),
                next = curr.next(),
                prev = curr.prev();
            if (delta < 0) {
                if (next.length < 1) return;
                next.addClass('current');
                $('body').animate({
                    scrollTop: next.offset().top
                }, speed);
            } else {
                if (prev.length < 1) return;
                prev.addClass('current');
                $('body').animate({
                    scrollTop: prev.offset().top
                }, speed);
            }
            curr.removeClass('current');
        }

        $('body').mousewheel(function(event, delta) {
            event.preventDefault();
            scroll(delta);
        });

        $('.btn-start').on('click', function(e) {
            scroll(-1);
        });

        $('.btn-entry').on('click', function(e) {
            $('.current').removeClass('current');
            $('.start').addClass('current');
            $('body').animate({
                scrollTop: 0
            }, speed);
        });
    }

    function LoadAnimate() {
        var controller = $.superscrollorama({
                triggerAtCenter: true
            }),
            scrollDuration = 200,
            sizes = [{
                scale: 1
            }, {
                scale: 1
            }, {
                scale: 1
            }];
        for (var i = 0, y = Data.List.length; i < y; i++) {
            var selector = '.item' + i,
                mod = i % 3;
            if (i % 2 == 0) {
                controller.addTween(selector, new TimelineMax().append([TweenMax.from($('.left-box', selector), scrollT, {
                    css: {
                        opacity: 0,
                        right: '50px'
                    },
                    ease: Quad.easeInOut
                }), TweenMax.from($('.right-box', selector), scrollT, {
                    css: {
                        opacity: 0,
                        left: '50px'
                    },
                    ease: Quad.easeInOut
                }), TweenMax.from($('.content-box', '.right-box'), scrollT, {
                    css: sizes[mod],
                    ease: Quad.easeInOut
                }, {
                    css: sizes[mod],
                    ease: Quad.easeInOut
                })]), scrollDuration)
            } else {
                controller.addTween(selector, new TimelineMax().append([TweenMax.from($('.left-box', selector), scrollT, {
                    css: {
                        opacity: 0,
                        left: '50px'
                    },
                    ease: Quad.easeInOut
                }), TweenMax.from($('.right-box', selector), scrollT, {
                    css: {
                        opacity: 0,
                        right: '50px'
                    },
                    ease: Quad.easeInOut
                }), TweenMax.from($('.content-box', '.right-box'), scrollT, {
                    css: sizes[mod],
                    ease: Quad.easeInOut
                }, {
                    css: sizes[mod],
                    ease: Quad.easeInOut
                })]), scrollDuration)
            }

        }
    }

    function LoadChart() {
        var colors = ["#7cb5ec", "#434348", "#90ed7d", "#f7a35c", "#8085e9", "#f15c80", "#e4d354", "#2b908f", "#f45b5b", "#91e8e1", "#ec7cd3", "#d0ec7c"],
            categories = ['01月', '02月', '03月', '04月', '05月', '06月', '07月', '08月', '09月', '10月', '11月', '12月'],
            data = [{
                y: 0,
                color: colors[0],
                drilldown: {
                    name: '01月',
                    data: [0]
                }
            }, {
                y: 0,
                color: colors[1],
                drilldown: {
                    name: '02月',
                    data: [0]
                }
            }, {
                y: 0,
                color: colors[2],
                drilldown: {
                    name: '03月',
                    data: [0]
                }
            }, {
                y: 0,
                color: colors[3],
                drilldown: {
                    name: '04月',
                    data: [0]
                }
            }, {
                y: 0,
                color: colors[4],
                drilldown: {
                    name: '05月',
                    data: [0]
                }
            }, {
                y: 113926,
                color: colors[5],
                drilldown: {
                    name: '06月',
                    data: [113926]
                }
            }, {
                y: 155043,
                color: colors[6],
                drilldown: {
                    name: '07月',
                    data: [155043]
                }
            }, {
                y: 151577,
                color: colors[7],
                drilldown: {
                    name: '08月',
                    data: [151577]
                }
            }, {
                y: 122749,
                color: colors[8],
                drilldown: {
                    name: '09月',
                    data: [122749]
                }
            }, {
                y: 127460,
                color: colors[9],
                drilldown: {
                    name: '10月',
                    data: [127460]
                }
            }, {
                y: 149144,
                color: colors[10],
                drilldown: {
                    name: '11月',
                    data: [149144]
                }
            }, {
                y: 20076,
                color: colors[11],
                drilldown: {
                    name: '12月',
                    data: [20076]
                }
            }];
        var chart = $('.year-data').highcharts({
                chart: {
                    type: 'column'
                },
                title: {
                    text: '2015年交易增长情况'
                },
                xAxis: {
                    categories: categories
                },
                yAxis: {
                    title: "",
                    min: 0, //y轴的最小值
                    tickInterval: 32000, //设置刻度隔几个值显示
                    max: 160000, //设置y轴最大值
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                plotOptions: {
                    column: {
                        dataLabels: {
                            enabled: true, //矩形上方是否显示数字
                            style: {
                                fontWeight: 'normal'
                            },
                            formatter: function() {
                                return this.y;
                            }
                        }
                    }
                },
                tooltip: {
                    formatter: function() {
                        var point = this.point,
                            s = this.x + ',' + this.y;
                        return s;
                    }
                },
                legend: { //去掉底下的缩略图列
                    enabled: false,
                },
                series: [{
                    data: data
                }],
                exporting: {
                    enabled: false
                }
            }).highcharts(); // return chart
    }

    $(function() {
        Init();
    });

    return {};
}();
